<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/reset.css" />
		<link rel="stylesheet" type="text/css" href="css/base.css" />
		<script src="js/jquery-1.10.1.min.js"></script>
		<script src="js/queryloader2.min.js"></script>

		<style>
			body,
			html {
				height: 100%;
			}
		</style>
		<script>
			var SHAKE_THRESHOLD = 3000;
			var last_update = 0;
			var x = y = z = last_x = last_y = last_z = 0;

			function init() {
				if (window.DeviceMotionEvent) {
					window.addEventListener('devicemotion', deviceMotionHandler, false);
				} else {
					alert('not support mobile event');
				}
			}

			function deviceMotionHandler(eventData) {
				var acceleration = eventData.accelerationIncludingGravity;
				var curTime = new Date().getTime();
				if ((curTime - last_update) > 100) {
					var diffTime = curTime - last_update;
					last_update = curTime;
					x = acceleration.x;
					y = acceleration.y;
					z = acceleration.z;
					var speed = Math.abs(x + y + z - last_x - last_y - last_z) / diffTime * 10000;
					if (speed > SHAKE_THRESHOLD) {
						if (typeof window.shake == "function") {
							shake();
						}
					}
					last_x = x;
					last_y = y;
					last_z = z;
				}
			}

			function shake() {
				mylight.run();
			}

			function runLigts(settings) {
				settings = settings || {};
				this.selector = settings.selector || null;
				this.type = settings.type || "order"; //order依次，random随时
				this.orderRang = settings.orderRang || 3; //依次闪亮重复次数
				this.randomCount = settings.randomCount || 6; //随机闪亮次数
				this.lightCls = settings.lightCls || "";
				this.onComplete = settings.onComplete || function() {};
				this.speed = settings.speed || 200; //默认200ms闪亮一下
				this.runing = false;
			}
			runLigts.prototype.run = function() {
				if (this.runing) return;
				this.runing = true;
				var type = this.type;
				$(this.selector + "." + this.lightCls).removeClass(this.lightCls);
				this[type]();
			};
			runLigts.prototype.random = function(Min, Max) {
				var Range = Max - Min;
				var Rand = Math.random();
				var num = Min + Math.round(Rand * Range);
				return num;
			};
			runLigts.prototype.order = function() {
				var $dom = $(this.selector);
				var random = this.random(0, $dom.length - 1);
				var index = 0;
				var _rang = 0;
				var that = this;

				function rang() {
					setTimeout(
						function() {
							var last = index - 1;
							if (last < 0) last = 0;
							$dom.eq(last).removeClass(that.lightCls);
							$dom.eq(index).addClass(that.lightCls);
							index++;
							if (index > $dom.length) {
								index = 0;
								_rang++;
							}
							if (_rang < that.orderRang) {
								rang();
							} else {
								$dom.eq(index).removeClass(that.lightCls);
								$dom.eq(random).addClass(that.lightCls);
								that.onComplete(random);
								that.runing = false;
							}
						}, that.speed
					);
				};
				rang();
			};
			var mylight = new runLigts({
				selector: ".round",
				lightCls: "red",
				randomCount: 4,
				onComplete: function() {
					setTimeout(function() {
						//location.href = "success.html";
					}, 2000);
				}
			});
			$(function() {
				init();
			});
		</script>
	</head>

	<body>
		<div class="hncj-container" id="preload">
			<div class="bg"></div>
			<img class="bg01" src="img/bg01.png" alt="bg01" />
			<img id="ticket" src="img/ticket.png" alt="ticket" />
			<img id="rule" src="img/rule.png" alt="rule" />
		</div>
		<!--
        	作者：245848724@qq.com
        	时间：2015-10-22
        	描述：hncj-container end
        -->

		<div class="share" style="display:none;"></div>

		<div class="hdgz-cover-box" id="rules" style="display:none;">
			<div class="hdgz-pop-box">
				<div class="hdgz-pop-close">
					<b></b>
				</div>
				<div class="hdgz-pop-content">
					<h2><img src="img/hdgz.png" alt="hdgz" /></h2>
					<ul>
						<li>1、活动时间：即日起至10月31日下午6点</li>
						<li>2、参与方式：关注合能•橙中心微信号，点击领取即可获得门票及其他礼品</li>
						<li>3、本次活动奖品数量有限，先到先得，发完即止</li>
						<li>4、针对恶意领取欢乐谷门票的行为，活动主办方有权不予发放</li>
						<li>5、每人只能参加一次，现场出示转发截图并登记即可领取，每个截图下均有记号标志，不可重复领取。</li>
						<li>6、本次活动最终解释权归合能橙中心所有</li>
					</ul>
				</div>
			</div>
		</div>

		<div class="ysj-container" style="display:none;">
			<div class="bg"></div>
			<!--<img class="ysj-bg01" src="img/ysj-bg01.png" alt="ysj-bg01" />-->
			<div class="y-body">
				<div class="round round01">
					<div class="padding"></div>
					<p>电影票</p>
				</div>
				<div class="round round02 red">
					<div class="padding"></div>
					<p>iPhone6S</p>
				</div>
				<div class="round round03">
					<div class="padding"></div>
					<p>欢乐谷
						<br />门票</p>
				</div>
				<div class="round round04">
					<div class="padding"></div>
					<p>万圣趴
						<br />入场券</p>
				</div>
			</div>
		</div>
		<!--
        	作者：245848724@qq.com
        	时间：2015-10-22
        	描述：ysj-container end
        -->
		<div id="form" class="success-cover" style="display:none;">
			<div class="success-container">
				<div class="bg"></div>
				<img class="s-bg01" src="img/s-bg01.png" alt="s-bg01" />
				<div class="success-body form-body">
					<h1>
						恭喜您！
						<br />
						获得******！
					</h1>
					<p>
						请于10月31日前访合能橙中心销售中心领取以上礼品
					</p>
					<div class="content">
						<em>【领奖时间】</em>待定
						<br />
						<em>【领奖地点】</em>地铁2号线天河路站D出口 合能橙中心销售中心<img src="img/daohang.png" alt="daohang" />
						<br />
						<em>【咨询电话】</em>028-651616669<img src="img/phone.png" alt="phone" />
					</div>
					<div class="join-form-bg">
						<div class="bg"></div>
						<div class="join-form">
							<div class="prompt">
								礼品采购中，请留下您的联系方式
								<br /> 以便于我们通知您具体领取时间
							</div>
							<div class="form">姓名
								<input type="text" />
							</div>
							<div class="form">电话
								<input type="text" />
							</div>
							<div class="action">
								<a href="javascript:void(0);" id="sumbit"><img src="img/sumbit.png" /></a>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<div id="gx" class="success-cover" style="display: none;">
			<div class="success-container">
				<div class="bg"></div>
				<img class="s-bg01" src="img/s-bg01.png" alt="s-bg01" />
				<div class="success-body">
					<h1>
						恭喜您！
						<br />
						获得万圣节门票！
					</h1>
					<p>
						请于10月31日前访合能橙中心销售中心领取以上礼品
					</p>
					<div class="content">
						<em>【领奖时间】</em>2015年10月31日18点前
						<br />
						<em>【领奖地点】</em>地铁2号线天河路站D出口 合能橙中心销售中心<img src="img/daohang.png" alt="daohang" />
						<br />
						<em>【咨询电话】</em>028-651616669<img src="img/phone.png" alt="phone" />
					</div>
				</div>
			</div>
		</div>

		<script>
			$("body").queryLoader2({
				barColor: "#efefef",
				backgroundColor: "#111",
				percentage: true,
				barHeight: 1,
				minimumTime: 200,
				fadeOutTime: 1000,
				onComplete: function() {
					$("#preload").show();
					$("#rule").on("click", function() {
						$("#rules").show();
					});
					$("#rules").on("click", function() {
						$(this).hide();
					});
					$("#ticket").on("click", function() {
						$(".share").show();
					});
					$(".share").on("click", function() {
						$(this).hide();
					});
					$("#sumbit").on("click", function() {
						$("#gx").show();
					});
					$("#gx").on("click", function() {
						$(this).hide();
					});
				}
			});
		</script>
	</body>

</html>